<template>
  <div class="home">
    <div class="filter-section">
      <data-filter @filter-change="handleFilterChange"/>
    </div>
    <div class="content-section">
      <h1>Welcome to Match Data Insight</h1>
    </div>
  </div>
</template>

<script setup lang="ts">
import DataFilter from '../components/DataFilter.vue'

const handleFilterChange = (filters: any) => {
  // 处理筛选条件变化
  console.log('筛选条件变更:', filters)
}
</script>

<style scoped>
.home {
  padding: 20px;
}

.filter-section {
  margin-bottom: 20px;
}

.content-section {
  background-color: #fff;
  padding: 20px;
  border-radius: 4px;
}
</style>
